<template>
	<up-titles :list="list" :index="index"></up-titles>
</template>

<script lang="ts" setup>
import { UpTitles } from '@/components/up'
import { PropType, computed } from 'vue'
import { LeagueType } from '@/types'

const props = defineProps({
	index: {
		type: Number,
		default: 0
	},
	leagueData: {
		type: Object as PropType<LeagueType>
	}
})

const list = computed(() => {
	const res: any[] = [
		{
			titleT: 'sports.titleChampion',
			icon: 'champion',
			iconColor: 'var(--color-warning)'
		}
	]
	if (props.leagueData) {
		res.unshift({
			title: props.leagueData.leagueName,
			image: props.leagueData.icon,
			imageDefault: 'sports/nation-default'
		})
	} else {
		res.unshift({
			titleT: '',
			icon: 'champion',
			iconColor: 'var(--color-warning)'
		})
	}
	return res
})
</script>
